<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<!-- basic styles -->
	<link href="__PUBLIC__/css/common.css" rel="stylesheet" />
	<link href="__PUBLIC__/css/bootstrap.min.css" rel="stylesheet" />
	<link href="__PUBLIC__/css/bootstrap-responsive.min.css" rel="stylesheet" />
	<link rel="stylesheet" href="__PUBLIC__/css/font-awesome.min.css" />
	<!--[if IE 7]>
	  <link rel="stylesheet" href="__PUBLIC__/css/font-awesome-ie7.min.css" />
	<![endif]-->
	<!-- page specific plugin styles -->
	<link rel="stylesheet" href="__PUBLIC__/css/jquery-ui-1.10.2.custom.min.css" />
	<link rel="stylesheet" href="__PUBLIC__/css/chosen.css" />
	<link rel="stylesheet" href="__PUBLIC__/css/datepicker.css" />
	<link rel="stylesheet" href="__PUBLIC__/css/bootstrap-timepicker.css" />
	<link rel="stylesheet" href="__PUBLIC__/css/daterangepicker.css" />
	<link rel="stylesheet" href="__PUBLIC__/css/colorpicker.css" />
	<!-- ace styles -->
	<link rel="stylesheet" href="__PUBLIC__/css/ace.min.css" />
	<link rel="stylesheet" href="__PUBLIC__/css/ace-responsive.min.css" />
	<link rel="stylesheet" href="__PUBLIC__/css/ace-skins.min.css" />
	<!--[if lt IE 9]>
	  <link rel="stylesheet" href="__PUBLIC__/css/ace-ie.min.css" />
	<![endif]-->
	<title>添加顶部栏目</title>
</head>
<body>
<div class="container-fluid" id="main-container">
		<!-- PAGE CONTENT BEGINS HERE -->
		<form class="form-horizontal" method="post">
			<div class="table-header" style="margin-bottom:20px;">
				栏目管理 | <a style="font-size:14px;" href="{|U:'Channel/add_chan'}">添加栏目</a>
			</div>
			<div class="control-group">
				<label class="control-label" for="form-field-5">栏目名称</label>
				<div class="controls" >
					<textarea style="width:300px;height:150px;" id="form-field-5" class="autosize-transition span12" placeholder="多个栏目名称，以【逗号，空格，或者换行符分割】" name="nname"></textarea>
				</div>
			</div>

			<div class="form-actions">
				<button class="btn btn-info" type="submit"><i class="icon-ok"></i>提交</button>
				&nbsp; &nbsp; &nbsp;
				<button class="btn" type="reset"><i class="icon-undo"></i>重置</button>
			</div>
		</form>
		<!-- PAGE CONTENT ENDS HERE -->		  
	</div><!-- #main-content -->

	<a href="#" id="btn-scroll-up" class="btn btn-small btn-inverse">
		<i class="icon-double-angle-up icon-only"></i>
	</a>

	<!-- basic scripts -->
	<script src="__PUBLIC__/js/jquery.min.js"></script>
	<script type="text/javascript">
	window.jQuery || document.write("<script src='__PUBLIC__/js/jquery-1.9.1.min.js'>\x3C/script>");
	</script>
	
	<script src="__PUBLIC__/js/bootstrap.min.js"></script>
	<!-- page specific plugin scripts -->
	
	<!--[if lt IE 9]>
	<script type="text/javascript" src="__PUBLIC__/js/excanvas.min.js"></script>
	<![endif]-->
	<script type="text/javascript" src="__PUBLIC__/js/jquery-ui-1.10.2.custom.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/jquery.ui.touch-punch.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/chosen.jquery.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/fuelux.spinner.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/bootstrap-datepicker.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/bootstrap-timepicker.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/date.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/daterangepicker.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/bootstrap-colorpicker.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/jquery.knob.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/jquery.autosize-min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/jquery.inputlimiter.1.3.1.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/js/jquery.maskedinput.min.js"></script>
	<!-- ace scripts -->
	<script src="__PUBLIC__/js/ace-elements.min.js"></script>
	<script src="__PUBLIC__/js/ace.min.js"></script>
	<!-- inline scripts related to this page -->
	
	<script type="text/javascript">
		$(function() {
			
			$('#add_value').on('click', function() {
				var value = $('#one-value').html();
				$('#goods-value').append(value);
			});

			$('#del_value').on('click', function() {
				var value = $('#one-value').html();
				$('#self-value').remove();
			});

			$('#id-disable-check').on('click', function() {
				var inp = $('#form-input-readonly').get(0);
				if(inp.hasAttribute('disabled')) {
					inp.setAttribute('readonly' , 'true');
					inp.removeAttribute('disabled');
					inp.value="This text field is readonly!";
				}
				else {
					inp.setAttribute('disabled' , 'disabled');
					inp.removeAttribute('readonly');
					inp.value="This text field is disabled!";
				}
			});


			$(".chzn-select").chosen(); 
			$(".chzn-select-deselect").chosen({allow_single_deselect:true}); 
			
			$('.ace-tooltip').tooltip();
			$('.ace-popover').popover();
			
			$('textarea[class*=autosize]').autosize({append: "\n"});
			$('textarea[class*=limited]').each(function() {
				var limit = parseInt($(this).attr('data-maxlength')) || 100;
				$(this).inputlimiter({
					"limit": limit,
					remText: '%n character%s remaining...',
					limitText: 'max allowed : %n.'
				});
			});
			
			$.mask.definitions['~']='[+-]';
			$('.input-mask-date').mask('99/99/9999');
			$('.input-mask-phone').mask('(999) 999-9999');
			$('.input-mask-eyescript').mask('~9.99 ~9.99 999');
			$(".input-mask-product").mask("a*-999-a999",{placeholder:" ",completed:function(){alert("You typed the following: "+this.val());}});
			
			
			
			$( "#input-size-slider" ).css('width','200px').slider({
				value:1,
				range: "min",
				min: 1,
				max: 6,
				step: 1,
				slide: function( event, ui ) {
					var sizing = ['', 'input-mini', 'input-small', 'input-medium', 'input-large', 'input-xlarge', 'input-xxlarge'];
					var val = parseInt(ui.value);
					$('#form-field-4').attr('class', sizing[val]).val('.'+sizing[val]);
				}
			});
			$( "#input-span-slider" ).slider({
				value:1,
				range: "min",
				min: 1,
				max: 11,
				step: 1,
				slide: function( event, ui ) {
					var val = parseInt(ui.value);
					$('#form-field-5').attr('class', 'span'+val).val('.span'+val).next().attr('class', 'span'+(12-val)).val('.span'+(12-val));
				}
			});
			
			
			var $tooltip = $("<div class='tooltip right in' style='display:none;'><div class='tooltip-arrow'></div><div class='tooltip-inner'></div></div>").appendTo('body');
			$( "#slider-range" ).css('height','200px').slider({
				orientation: "vertical",
				range: true,
				min: 0,
				max: 100,
				values: [ 17, 67 ],
				slide: function( event, ui ) {
					var val = ui.values[$(ui.handle).index()-1]+"";
					
					var pos = $(ui.handle).offset();
					$tooltip.show().children().eq(1).text(val);		
					$tooltip.css({top:pos.top - 10 , left:pos.left + 18});
					
					//$(this).find('a').eq(which).attr('data-original-title' , val).tooltip('show');
				}
			});
			$('#slider-range a').tooltip({placement:'right', trigger:'manual', animation:false}).blur(function(){
				$tooltip.hide();
				//$(this).tooltip('hide');
			});
			//$('#slider-range a').tooltip({placement:'right', animation:false});
			
			$( "#slider-range-max" ).slider({
				range: "max",
				min: 1,
				max: 10,
				value: 2,
				//slide: function( event, ui ) {
				//	$( "#amount" ).val( ui.value );
				//}
			});
			//$( "#amount" ).val( $( "#slider-range-max" ).slider( "value" ) );
			
			$( "#eq > span" ).css({width:'90%', float:'left', margin:'15px'}).each(function() {
				// read initial values from markup and remove that
				var value = parseInt( $( this ).text(), 10 );
				$( this ).empty().slider({
					value: value,
					range: "min",
					animate: true
					
				});
			});
			
			$('#id-input-file-1 , #id-input-file-2').ace_file_input({
				no_file:'No File ...',
				btn_choose:'Choose',
				btn_change:'Change',
				droppable:false,
				onchange:null,
				thumbnail:false //| true | large
				//whitelist:'gif|png|jpg|jpeg'
				//blacklist:'exe|php'
				//onchange:''
				//
			});
			
			$('#id-input-file-3').ace_file_input({
				style:'well',
				btn_choose:'Drop files here or click to choose',
				btn_change:null,
				no_icon:'icon-cloud-upload',
				droppable:true,
				onchange:null,
				thumbnail:'small',
				before_change:function(files, dropped) {
					/**
					if(files instanceof Array || (!!window.FileList && files instanceof FileList)) {
						//check each file and see if it is valid, if not return false or make a new array, add the valid files to it and return the array
						//note: if files have not been dropped, this does not change the internal value of the file input element, as it is set by the browser, and further file uploading and handling should be done via ajax, etc, otherwise all selected files will be sent to server
						//example:
						var result = []
						for(var i = 0; i < files.length; i++) {
							var file = files[i];
							if((/^image\//i).test(file.type) && file.size < 102400)
								result.push(file);
						}
						return result;
					}
					*/
					return true;
				}
				/*,
				before_remove : function() {
					return true;
				}*/
			}).on('change', function(){
				//console.log($(this).data('ace_input_files'));
				//console.log($(this).data('ace_input_method'));
			});
			
			$('#spinner1').ace_spinner({value:0,min:0,max:200,step:10, btn_up_class:'btn-info' , btn_down_class:'btn-info'})
			.on('change', function(){
				//alert(this.value)
			});
			$('#spinner2').ace_spinner({value:0,min:0,max:10000,step:100, icon_up:'icon-caret-up', icon_down:'icon-caret-down'});
			$('#spinner3').ace_spinner({value:0,min:-100,max:100,step:10, icon_up:'icon-plus', icon_down:'icon-minus', btn_up_class:'btn-success' , btn_down_class:'btn-danger'});
			
			/**
			var stubDataSource = {
			data: function (options, callback) {
				setTimeout(function () {
					callback({
						data: [
							{ name: 'Test Folder 1', type: 'folder', additionalParameters: { id: 'F1' } },
							{ name: 'Test Folder 1', type: 'folder', additionalParameters: { id: 'F2' } },
							{ name: 'Test Item 1', type: 'item', additionalParameters: { id: 'I1' } },
							{ name: 'Test Item 2', type: 'item', additionalParameters: { id: 'I2' } }
						]
					});
				}, 0);
			}
			};
			$('#MyTree').tree({ dataSource: stubDataSource , multiSelect:true })
			*/
			
			$('.date-picker').datepicker();
			$('#timepicker1').timepicker({
				minuteStep: 1,
				showSeconds: true,
				showMeridian: false
			});
			
			$('#id-date-range-picker-1').daterangepicker();
			
			$('#colorpicker1').colorpicker();
			$('#simple-colorpicker-1').ace_colorpicker();	
		$(".knob").knob();

			});
	</script>
</body>
</html>